<template>
  <div>
    <h1 v-show="!isShow">登录</h1>
    <h1 v-show="isShow">注册</h1>
      <el-input v-model="form.username"v-show="!isShow" placeholder="Please input" />
      <el-input
          v-model="form.password"
          type="password"v-show="!isShow"
          placeholder="Please input password"
          show-password
      />
    <el-input v-model="form.username"v-show="isShow" placeholder="Please input" />
    <el-input
        v-model="form.password"
        type="password"v-show="isShow"
        placeholder="Please input password"
        show-password
    />
    <el-input v-show="isShow" v-model="form.passwordChk" placeholder="Please input" />

    <el-button color="#626aef"v-show="!isShow" @click="onsubmit">登录</el-button>
    <el-button color="#626aef"v-show="!isShow" @click="isShow=!isShow">注册</el-button>
    <el-button color="#626aef"v-show="isShow" @click="register">确定注册</el-button>
    <el-button color="#626aef"v-show="isShow"@click="isShow=!isShow">返回</el-button>
  </div>
</template>
<script lang="ts" setup>
import {reactive, ref} from 'vue'
import axios from "axios";
import {useRouter} from "vue-router";
const isShow = ref(false)
const form = reactive({
  username:'',
  password:'',
  passwordChk:''
})
const router =  useRouter()
function onsubmit(){
  axios.post("http://localhost:8090/manageSystemVue3/login",{
    username:form.username,
    password:form.password
  }).then(function (res){
    debugger
    if(res.data==true){
      alert("登录成功！")
      router.push("/menu")
    }else{
      alert("用户名或密码错误！")
    }
  })
}
function register(){
  if(form.password!=form.passwordChk){
    alert("密码不一致！")
    return;
  }
  axios.post("http://localhost:8090/manageSystemVue3/register",{
    username:form.username,
    password:form.password
  }).then(function (res){
    debugger
    if(res.data==true){
      alert("注册成功！")
      // router.push("/menu")
    }else{
      alert("用户名已存在！")
    }
  })
}
</script>